<template>
  {{article}}
  <el-form >
    <el-form-item label="标题">

      <el-input v-model="article.title"></el-input>
    </el-form-item>
    <el-form-item label="简介">

      <el-input v-model="article.description"></el-input>
    </el-form-item>
    <el-form-item>

      <mavon-editor v-model="article.content" ></mavon-editor>
    </el-form-item>


    <el-button @click="submitForm">修改</el-button>
    <el-button @click="deletearticle">删除</el-button>

  </el-form>
</template>

<script>
import { editArticle, getArticle,deleteArticle} from "@/api/article";

export default {
  name: "BlogEdit",
  data(){
    return{
      article:[]
    }
  },
  methods:{
    getarticle(){
      let that=this
      console.log(this.$route.params.id)
      getArticle(this.$route.params.id).then(res=>{
        that.article=res.data
      }).catch(()=>{
        alert("错误加载")
      })
    },
    submitForm(){
      let data={
        id:this.article.id,
        title:this.article.title,
        description:this.article.description,
        content:this.article.content
      }
      let that=this
      editArticle(data.id,data).then(()=>{
        that.$router.push("/")
      })
    },
    deletearticle(){
      let that=this
      deleteArticle(this.article.id).then(res=>{
        that.$router.push("/")
      })
    }
  },
  mounted() {
    this.getarticle()
  }
}
</script>

<style scoped>

</style>
